<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <link rel="stylesheet" type="text/css" href="/static/jquery-easyui-1.7.0/themes/metro-blue/easyui.css">
    <link rel="stylesheet" type="text/css" href="/static/jquery-easyui-1.7.0/themes/icon.css">
    <script type="text/javascript" src="/static/jquery-easyui-1.7.0/jquery.min.js"></script>
    <script type="text/javascript" src="/static/jquery-easyui-1.7.0/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/static/jquery-easyui-1.7.0/locale/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript">
        var url;

        function searchUser() {
            $("#dg").datagrid('load', {
                "userName": $("#s_userName").val(),
                "email": $("#s_email").val(),
                "roleName": $("#s_roleName").val(),
                "isOff": $("#s_isOff").val()
            });
        }

        function resetValue() {
            $("#s_userName").val("");
            $("#s_email").val("");
            $("#s_isOff").combobox("setValue", "");
            $("#s_roleName").combobox("setValue", "");
            $("#userName").textbox("setValue", "");
            $("#nickName").textbox("setValue", "");
            $("#email").textbox("setValue", "");
            $("#password").passwordbox("setValue", "");
            $("#password2").passwordbox("setValue", "");
            //添加或减少积分
            $("#userNameAddOrReducePoints").textbox("setValue", "");
            $("#idAddOrReducePoints").val();
            $("#status").val();
            $("#points").numberbox("setValue", "");
        }

        function openUserAddDialog() {
            $("#dlg").dialog("open").dialog("setTitle", "添加用户信息");
            $('#userName').textbox('readonly', false);
            url = "/admin/user/save";
        }

        function openUserModifyDialog() {
            var selectedRows = $("#dg").datagrid("getSelections");
            if (selectedRows.length != 1) {
                $.messager.alert("系统提示", "请选择一条要修改的数据！");
                return;
            }
            var row = selectedRows[0];
            $("#dlg").dialog("open").dialog("setTitle", "修改用户信息");
            $("#fm").form("load", row);
            $("#password2").passwordbox("setValue", $("#password").val());
            $('#userName').textbox('readonly', true);
            url = "/admin/user/save?id=" + row.id;
        }

        function closeUserDialog() {
            $("#dlg").dialog("close");
            resetValue();
        }

        function closeAddOrReducePointsDialog() {
            $("#dlg2").dialog("close");
            resetValue();
        }

        function saveUser() {
            $("#fm").form("submit", {
                url: url,
                onSubmit: function () {
                    return $(this).form("validate");
                },
                success: function (result) {
                    var result = eval('(' + result + ')');
                    if (result.success) {
                        $.messager.alert("系统提示", "保存成功！");
                        resetValue();
                        $("#dlg").dialog("close");
                        $("#dg").datagrid("reload");
                    } else {
                        $.messager.alert("系统提示", result.errorInfo);
                    }
                }
            });
        }

        function deleteUser() {
            var selectedRows = $("#dg").datagrid("getSelections");
            if (selectedRows.length == 0) {
                $.messager.alert("系统提示", "请选择要删除的数据！");
                return;
            }
            var strIds = [];
            for (var i = 0; i < selectedRows.length; i++) {
                strIds.push(selectedRows[i].id);
            }
            var ids = strIds.join(",");
            $.messager.confirm("系统提示", "您确定要删除<span style='color: red'>" + selectedRows.length + "</span>这条数据吗?", function (r) {
                if (r) {
                    $.post("/admin/user/delete", {ids: ids}, function (result) {
                        if (result.success) {
                            $.messager.alert("系统提示", "数据已成功删除！");
                            $("#dg").datagrid("reload");
                        } else {
                            $.messager.alert("系统提示", result.errorInfo);
                        }
                    }, "json");
                }
            });
        }

        $(document).ready(function () {

            $("#dg").datagrid({
                onDblClickRow: function (index, row) {
                    $("#dlg").dialog("open").dialog("setTitle", "修改用户信息");
                    $("#fm").form("load", row);
                    $("#password2").passwordbox("setValue", $("#password").val());
                    $('#userName').textbox('readonly', true);
                    url = "/admin/user/save?id=" + row.id;
                }
            });

        });

        function modifyOff() {
            var selectedRows = $("#dg").datagrid("getSelections");
            if (selectedRows.length != 1) {
                $.messager.alert("系统提示", "请选择一个用户！");
                return;
            }
            var id = selectedRows[0].id;
            var isOff = selectedRows[0].isOff;
            if (isOff == 0) {
                var str = "封禁";
            } else if (isOff == 1) {
                var str = "解封";
            }
            $.messager.confirm("系统提示", "确定要<span style='color: red'>" + str + "</span>这个用户吗?", function (r) {
                if (r) {
                    $.post("/admin/user/modifyOff", {id: id, isOff: isOff == 0 ? 1 : 0}, function (result) {
                        if (result.success) {
                            $("#dg").datagrid("reload");
                            $.messager.alert("系统提示", str + "成功!");
                        } else {
                            $.messager.alert("系统提示", result.errorInfo);
                        }
                    })
                }
            });
        }

        function modifyRoleType() {
            var selectedRows = $("#dg").datagrid("getSelections");
            if (selectedRows.length != 1) {
                $.messager.alert("系统提示", "请选择一个用户！");
                return;
            }
            var id = selectedRows[0].id;
            var roleName = selectedRows[0].roleName;
            var userName = selectedRows[0].userName;
            if (roleName == "普通用户") {
                var str = "VIP用户";
            } else if (roleName == "VIP用户") {
                var str = "普通用户";
            }
            $.messager.confirm("系统提示", "确定要将用户名为<span style='color: red'>" + userName + "</span>的用户设置为<span style='color: red'>" + str + "</span>吗?", function (r) {
                if (r) {
                    $.post("/admin/user/modifyRoleType", {
                        id: id,
                        roleName: roleName == "普通用户" ? "VIP用户" : "普通用户"
                    }, function (result) {
                        if (result.success) {
                            $("#dg").datagrid("reload");
                            $.messager.alert("系统提示", "已经成功将该用户设置为" + str);
                        } else {
                            $.messager.alert("系统提示", result.errorInfo);
                        }
                    })
                }
            });
        }

        function openAddOrReducePointsDialog(status) {
            $('#userNameAddOrReducePoints').textbox('readonly', true);
            var selectedRows = $("#dg").datagrid("getSelections");
            if (selectedRows.length != 1) {
                $.messager.alert("系统提示", "请选择一个用户！");
                return;
            }
            if (status == 1) {
                $("#dlg2").dialog("open").dialog("setTitle", "加积分");
            } else {
                $("#dlg2").dialog("open").dialog("setTitle", "减积分");
            }
            $("#userNameAddOrReducePoints").textbox("setValue", selectedRows[0].userName);
            $("#idAddOrReducePoints").val(selectedRows[0].id);
            $("#status").val(status);
        }

        function submitMyData() {
            var userId = $("#idAddOrReducePoints").val();
            var status = $("#status").val();
            var points = $("#points").numberbox("getValue");
            if (status == 1) {
                var str = "加";
            } else {
                var str = "减";
            }
            $.messager.confirm("系统提示", "确定要给这个用户<span style='color: red'>" + str + "</span><span style='color:green'>" + points + "</span>积分吗?", function (r) {
                if (r) {
                    $.post("/admin/user/addOrReducePoints", {
                        id: userId,
                        status: status,
                        points: points
                    }, function (result) {
                        if (result.success) {
                            $("#dg").datagrid("reload");
                            $.messager.alert("系统提示", str+"积分成功!");
                            closeAddOrReducePointsDialog();
                        } else {
                            $.messager.alert("系统提示", result.errorInfo);
                        }
                    })
                }
            });
        }

        function formatIsOff(val, row) {
            if (val == 0) return "否";
            if (val == 1) return "<span style='color: red'>是</span>";
        }

        function formatRoleName(val, row) {
            if (val == "普通用户") return "普通用户";
            if (val == "VIP用户") return "<span style='color: red'>VIP用户</span>";
        }
    </script>
</head>
<body style="margin: 1px">
<table id="dg" title="用户管理" class="easyui-datagrid" striped="true"
       fitColumns="true" pagination="true" rownumbers="true"
       url="/admin/user/list" fit="true" toolbar="#tb">
    <thead>
    <th field="cb" checkbox="true" align="center"></th>
    <th field="id" width="10" align="center">id</th>
    <th field="userName" width="30" align="center">用户名</th>
    <th field="nickName" width="20" align="center">昵称</th>
    <th field="email" width="50" align="center">邮箱</th>
    <th field="points" width="20" align="center">剩余积分</th>
    <th field="isOff" width="20" align="center" formatter="formatIsOff">是否被封禁</th>
    <th field="roleName" width="20" align="center" formatter="formatRoleName">用户类型</th>
    <th field="registerDate" width="30" align="center">注册时间</th>
    </thead>
</table>
<div id="tb">
    <div>
        <a href="javascript:openUserAddDialog()" class="easyui-linkbutton" iconCls="icon-add" plain="true">添加</a>
        <a href="javascript:openUserModifyDialog()" class="easyui-linkbutton" iconCls="icon-edit"
           plain="true">修改</a>
        <a href="javascript:deleteUser()" class="easyui-linkbutton" iconCls="icon-remove" plain="true">删除</a>
        <a href="javascript:modifyOff()" class="easyui-linkbutton" iconCls="icon-modifyOff" plain="true">封禁或解封</a>
        <a href="javascript:modifyRoleType()" class="easyui-linkbutton" iconCls="icon-modifyRoleType" plain="true">切换用户类型</a>
        <a href="javascript:openAddOrReducePointsDialog(1)" class="easyui-linkbutton" iconCls="icon-addPoints"
           plain="true">加积分</a>
        <a href="javascript:openAddOrReducePointsDialog(2)" class="easyui-linkbutton" iconCls="icon-reducePoints"
           plain="true">减积分</a>
    </div>
    <div>
        &nbsp;用户名：&nbsp;<input type="text" id="s_userName" size="20" onkeydown="if(event.keyCode==13) searchUser()"/>
        &nbsp;邮箱：&nbsp;<input type="text" id="s_email" size="20" onkeydown="if(event.keyCode==13) searchUser()"/>
        &nbsp;用户类型：&nbsp;
        <select id="s_roleName" class="easyui-combobox" name="type" style="width:130px;" panelHeight="auto">
            <option value="">请选择...</option>
            <option value="普通用户">普通用户</option>
            <option value="VIP用户">VIP用户</option>
        </select>
        &nbsp;是否被封禁：&nbsp;
        <select id="s_isOff" class="easyui-combobox" name="type" style="width:130px;" panelHeight="auto">
            <option value="">请选择...</option>
            <option value="1">是</option>
            <option value="0">否</option>
        </select>
        <a href="javascript:searchUser()" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
        <a href="javascript:resetValue()" class="easyui-linkbutton" iconCls="icon-reset" plain="true">重置</a>
    </div>
</div>
<div id="dlg" class="easyui-dialog" style="width: 433px;height: 325px;padding: 10px 20px"
     closed="true" buttons="#dlg-buttons" data-options="onClose:function(){resetValue()}">
    <form id="fm" method="post">
        <table cellspacing="8px">
            <tr>
                <td>用户名：</td>
                <td>
                    <input type="text" id="userName" name="userName" class="easyui-textbox" required="true"
                           style="width: 250px"/>
                </td>
            </tr>
            <tr>
                <td>密码：</td>
                <td>
                    <input type="text" id="password" name="password" class="easyui-passwordbox" showEye="true"
                           required="true"
                           style="width: 250px"/>
                </td>
            </tr>
            <tr>
                <td>确认密码：</td>
                <td>
                    <input type="text" id="password2" name="password2" class="easyui-passwordbox" showEye="true"
                           required="true"
                           style="width: 250px"/>
                </td>
            </tr>
            <tr>
                <td>昵称：</td>
                <td>
                    <input type="text" id="nickName" name="nickName" class="easyui-textbox" required="true"
                           style="width: 250px"/>
                </td>
            </tr>
            <tr>
                <td>邮箱：</td>
                <td>
                    <input type="text" id="email" name="email" class="easyui-textbox" required="true"
                           style="width: 250px"/>
                </td>
            </tr>
        </table>
    </form>
</div>
<div id="dlg2" class="easyui-dialog" style="width: 433px;height: 200px;padding: 10px 20px"
     closed="true" buttons="#dlg2-buttons" data-options="onClose:function(){resetValue()}">
    <form id="fm" method="post">
        <table cellspacing="8px">
            <tr>
                <td>用户名：</td>
                <td>
                    <input type="text" id="userNameAddOrReducePoints" class="easyui-textbox" required="true"
                           style="width: 250px"/>
                    <input type="hidden" id="idAddOrReducePoints" style="width: 250px"/>
                    <input type="hidden" id="status" style="width: 250px"/>
                </td>
            </tr>
            <tr>
                <td>积分数：</td>
                <td>
                    <input type="text" id="points" class="easyui-numberbox" showEye="true" required="true"
                           style="width: 250px"/>
                </td>
            </tr>
        </table>
    </form>
</div>
<div id="dlg-buttons">
    <a href="javascript:saveUser()" class="easyui-linkbutton" iconCls="icon-ok">保存</a>
    <a href="javascript:closeUserDialog()" class="easyui-linkbutton" iconCls="icon-cancel">关闭</a>
</div>
<div id="dlg2-buttons">
    <a href="javascript:submitMyData()" class="easyui-linkbutton" iconCls="icon-ok">保存</a>
    <a href="javascript:closeAddOrReducePointsDialog()" class="easyui-linkbutton" iconCls="icon-cancel">关闭</a>
</div>
</body>
</html>